<div class="modal" id="personalinformations">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal">x</button>
				<h4 class="modal-title">{{ Users_PersonalInformations }}</h4>
			</div>
			<div class="modal-body">
				<div class="container">
					<div class="row">
						<div class="col-sm-8">
							<form>
								<div class="row">
									<div class="col-md-4">
										<div class="fileInput" ng-show="personalUserHasAvatar" id="editPersonalAvatarUpdate" ondrop="drop(event)" ondragover="allowDrop(event)" ondragleave="dragleave(event)"><img ng-src="data:{{ personalUserAvatarMime }};base64,{{ personalUserAvatar }}" width="100%" /></div>
										<div class="fileInput" ng-hide="personalUserHasAvatar" id="editPersonalAvatarNew" ondrop="drop(event)" ondragover="allowDrop(event)" ondragleave="dragleave(event)">Déposez une photo</div>
									</div>	
									<div class="col-md-8">
										<div class="row form-group">
											<div class="col-xs-7">{{ Users_Fisrtname }} <input ng-model="personalUserFirstname" class="form-control" placeholder="{{ Users_Fisrtname }}"/></div>
										</div>
										<div class="row form-group">
											<div class="col-xs-7">{{ Users_Lastname }} <input ng-model="personalUserLastname" class="form-control" placeholder="{{ Users_Lastname }}"/></div>
										</div>
										<div class="row form-group">
											<div class="col-xs-7">{{ Users_Email }} <input ng-model="personalUserEmail" class="form-control" placeholder="{{ Users_Email }}"/></div>
										</div>
									</div>
									<div class="row form-group">
										<div class="col-xs-5">{{ Users_Company }} <input ng-model="personalUserCompany" class="form-control" placeholder="{{ Users_Company }}"/></div>
									</div>
									<div class="row form-group">
										<div class="col-xs-6">{{ Users_PhoneNumber }} <input ng-model="personalUserPhoneNumber" class="form-control" placeholder="{{ Users_PhoneNumber }}"/></div>
									</div>
									<div class="row form-group">
										<div class="col-xs-6">{{ Users_WebAddress }} <input ng-model="personalUserWebAddress" class="form-control" placeholder="{{ Users_WebAddress }}"/></div>
									</div>
									<div class="row form-group">
										<div class="col-xs-6">{{ Users_Login }} <input ng-model="personalUserLogin" class="form-control" placeholder="{{ Users_Login }}"/></div>
									</div>
									<div class="row form-group">
										<div class="col-xs-6">{{ Users_NewPassword }} <input ng-model="newPassword" class="form-control" /></div>
									</div>
								</div>
								<img ng-show="loadingPersonalInformations" desc="banner" style="width:25px;height:25px" alt="{{ Main_Loading }}" src="Resources/Pictures/ajax-loader.gif" />
								<button ng-hide="loadingPersonalInformations" type="button" class="btn btn-primary" ng-click="updateUserCommand()">
									<span class="glyphicon glyphicon-ok"></span> {{ Main_Validate }}
								</button>
							</form>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<script>
	
	var editPersonalAvatarUpdate = document.getElementById("editPersonalAvatarUpdate");
	var editPersonalAvatarNew = document.getElementById("editPersonalAvatarNew");
	
	document.allowDrop = function(ev) {
		ev.preventDefault();
		editPersonalAvatarUpdate.style.background = '#E4E4E4';
		editPersonalAvatarNew.style.background = '#E4E4E4';
	}
	
	document.dragleave = function(event) {
		event.preventDefault();
		editPersonalAvatarUpdate.style.background = 'white';
		editPersonalAvatarNew.style.background = 'white';
	}
	
	document.drag = function(ev) {
		ev.dataTransfer.setData("poster", ev.target.id);
	}
	
	document.drop = function(ev) {
		ev.preventDefault();
		var dt = ev.dataTransfer;
		var files = dt.files;
		console.info('drop avatar event ' + files.length);
		if(files.length > 0)
		{
			var firstFile = files[0];
			angular.element(document.getElementById('editPersonalAvatarUpdate')).scope().setAvatarCommand(firstFile);
		}
		editPersonalAvatarUpdate.style.background = 'white';
		editPersonalAvatarNew.style.background = 'white';
	}
	
	
</script>